<script setup lang="ts">
import {reactive, ref} from 'vue'

const showDialog = ref(false)
const showDialog1 = ref(false)
const showDialog2 = ref(false)
const showForm = ref({
  auditStatus: '',
  auditDetail: '',
  hotelName: '',
  legalName: '',
  hotelLegalContext: '',
  username: '',
  expiresTime: '',
})
const showForm1 = ref({
  auditStatus: '',
  auditDetail: '',
  hotelName: '',
  hotelContext: '',
  hotelPhone: '',
  username: '',
  hotelImg: '',
})
const showForm2 = ref({
  auditStatus: '',
  auditDetail: '',
  hotelName: '',
  username: '',
  roomType:'',
  roomImage:'',
  price:''
})
defineExpose({
      showDialog,
      showForm,
      showDialog1,
      showForm1,
      showDialog2,
      showForm2
    }
)
</script>

<template>
  <!--加盟展示-->
  <el-dialog
      v-model="showDialog"
      title="酒店信息"
      width="800"
      center
  >
    <el-row justify="center" style="margin-bottom: 20px">
      <p>酒店名称：{{ showForm.hotelName }}</p>
    </el-row>
    <el-row justify="center" style="margin-bottom: 20px">
      <p>酒店法人：{{ showForm.legalName }}</p>
    </el-row>
    <el-row justify="center" style="margin-bottom: 20px">
      <p>法人联系方式：{{ showForm.hotelLegalContext }}</p>
    </el-row>
    <el-row justify="center" style="margin-bottom: 20px">
      <p>审核员：{{ showForm.username }}</p>
    </el-row>
    <el-row justify="center" style="margin-bottom: 20px">
      <p>审核时间：{{ showForm.expiresTime }}</p>
    </el-row>
    <el-row justify="center" style="margin-bottom: 20px">
      <p>审核状态：{{ showForm.auditStatus }}</p>
    </el-row>
    <el-row justify="center" style="margin-bottom: 20px">
      <p>审核情况：{{ showForm.auditDetail }}</p>
    </el-row>
    <template #footer>
      <div class="dialog-footer">
        <el-button @click="showDialog = false">取消</el-button>
        <el-button type="primary" @click="showDialog = false">
          确认
        </el-button>
      </div>
    </template>
  </el-dialog>
  <!--酒店展示-->
  <el-dialog
      v-model="showDialog1"
      title="酒店信息"
      width="800"
      center
  >
    <el-row justify="center" style="margin-bottom: 20px">
      <p>酒店名称：{{ showForm1.hotelName }}</p>
    </el-row>
    <el-row justify="center" style="margin-bottom: 20px">
      <p>酒店联系人：{{ showForm1.hotelContext }}</p>
    </el-row>
    <el-row justify="center" style="margin-bottom: 20px">
      <p>联系人电话：{{ showForm1.hotelPhone }}</p>
    </el-row>
    <el-row justify="center" style="margin-bottom: 20px">
      <p>审核员：{{ showForm1.username }}</p>
    </el-row>
    <el-row justify="center" style="margin-bottom: 20px">
      <p>审核状态：{{ showForm1.auditStatus }}</p>
    </el-row>
    <el-row justify="center" style="margin-bottom: 20px">
      <p>审核情况：{{ showForm1.auditDetail }}</p>
    </el-row>
    <template #footer>
      <div class="dialog-footer">
        <el-button @click="showDialog1 = false">取消</el-button>
        <el-button type="primary" @click="showDialog1 = false">
          确认
        </el-button>
      </div>
    </template>
  </el-dialog>
  <!--房型展示-->
  <el-dialog
      v-model="showDialog2"
      title="酒店信息"
      width="800"
      center
  >
    <el-row justify="center" style="margin-bottom: 20px">
      <p>酒店名称：{{ showForm2.hotelName }}</p>
    </el-row>
    <el-row justify="center" style="margin-bottom: 20px">
      <p>房间类型：{{ showForm2.roomType }}</p>
    </el-row>
    <el-row justify="center" style="margin-bottom: 20px">
      <p>审核员：{{ showForm2.username }}</p>
    </el-row>
    <el-row justify="center" style="margin-bottom: 20px">
      <p>审核状态：{{ showForm2.auditStatus }}</p>
    </el-row>
    <el-row justify="center" style="margin-bottom: 20px">
      <p>审核情况：{{ showForm2.auditDetail }}</p>
    </el-row>
    <template #footer>
      <div class="dialog-footer">
        <el-button @click="showDialog2 = false">取消</el-button>
        <el-button type="primary" @click="showDialog2 = false">
          确认
        </el-button>
      </div>
    </template>
  </el-dialog>
</template>

<style scoped lang="scss">
p {
  line-height: 22px;
}
</style>